<template>
  <div>

    <!--  中间  -->
    <div class="selece">
      <div><img src="../assets/ico@1x1.png" alt=""></div>
      <p>登录</p>
      <input type="tel" placeholder="请输入您的手机号" v-model="AccoutId">
      <p>密码</p>
      <input type="password" placeholder="请输入您的密码" v-model="Password">
      <!--<p>填写邀请码</p>-->
      <!--<input type="text" placeholder="请输入您的邀请码" v-model="inviteCode">-->
      <button v-on:click="Loging">立即登录</button>
      <!--<router-link to="/fxregister" style="text-decoration: none"><p>点击立即注册</p></router-link>-->
    </div>
    <alertTip v-if="showAlert" @closeTip="go()" :alertText="alertText"></alertTip>
  </div>
</template>
<script>
  import Vue from 'vue'
  import {wxHttpTool} from './httpUtil/httpUtil'
  export default {
    name: "Login",
    data() {
      return {
        AccoutId: '',
        Password: '',
//        inviteCode: '',
        showAlert: false,
        alertText: ''
      }
    },
     created () {
        wxHttpTool.wxAuthor(this,function(varRet,varJson){
          if(varRet == -1){
            this.telephone = '';
                this.alertTip('网络错误');
                this.go = function(){
                   this.showAlert = false;
                }
             return;   
          }

          if (varJson.data.p.isTrue == false){
                this.showAlert = true;
                this.alertText = varJson.data.p.errorMsg;
                return;
          }

          this.showAlert = true;
          this.alertText = "登陆成功";
          if (res.data.p.user.type === 0) {
                this.go = function () {
                  this.showAlert = false;
                  if (window.localStorage.loginGo) {
                    window.history.go(-1);
                  } else {
                    this.$router.push({name: 'mall'})
                  }

                }
                // this.$router.push({name: 'mall'})
              } else if (res.data.p.user.type === 1) {
                this.$router.push("/disTrueHome");
                if (res.data.p.hasOwnProperty('shop')) {
                  localStorage.setItem('shopId', res.data.p.shop.id);
                }
                this.go = function () {
                  this.showAlert = false;
                  this.$router.push("/disTrueHome");
                }

              } else {
                this.showAlert = true;
                this.alertText = 'type=' + res.data.p.user.type;
              }
        })
        

    },
    methods: {
      chooseImage: function () {
        wx.chooseImage({
          count: 1,
          needResult: 1,
          sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
          sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
          success: function (data) {
            let localIds = data.localIds[0].toString(); // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
            /*if (rh.tostr(localIds)) {
             wxuploadImage(localIds);
             }*/
          },
          /*   fail: function (res) {
           alterShowMessage("操作提示", JSON.stringify(res), "1", "确定", "", "", "");
           }*/

        });
      },
      go(){
        this.showAlert = false;
      },
      Loging: function () {
        console.log(this.AccoutId)
        let jsonValue = JSON.stringify({
          "c": "10005",
          "p": {
            "platId": this.AccoutId,
            "passWord": this.Password
//            "userType": 1,
//            "openid":''
          }
        })

        const tel = /^1[34578]\d{9}$/;
        if (!tel.test(this.AccoutId)) {
          this.showAlert = true;
          this.alertText = "请输入正确的手机号或密码";
        }
        else {
          this.$http.post(api + '/qqs.us', jsonValue).then((response) => {
            console.log(response);
            if (response.data.p.isTrue == true) {
              this.showAlert = true;
              this.alertText = "登陆成功";
              window.localStorage.loginP = JSON.stringify(response.data.p);
              window.localStorage.data = JSON.stringify(response.data.p.user);
              localStorage.setItem('token', response.data.p.token);
              this.telephone = '';
              this.password = '';
              if (response.data.p.user.type === 0) {
                this.go = function () {
                  this.showAlert = false;
                  if (window.localStorage.loginGo) {
                    window.history.go(-1);
                  } else {
                    this.$router.push({name: 'mall'})
                  }

                }
                // this.$router.push({name: 'mall'})
              } else if (response.data.p.user.type === 1) {
                this.$router.push("/disTrueHome");
                if (response.data.p.hasOwnProperty('shop')) {
                  localStorage.setItem('shopId', response.data.p.shop.id);
                }
                this.go = function () {
                  this.showAlert = false;
                  this.$router.push("/disTrueHome");
                }
                // this.$router.push("/disTrueHome");
//                if (response.data.p.hasOwnProperty('shop')) {
//                  localStorage.setItem('shopId', response.data.p.shop.id);
//                  this.$router.push("/disTrueHome")
//                } else {
//                  this.$router.push("/shopSet")
//                }
              } else {
                this.showAlert = true;
                this.alertText = 'type=' + response.data.p.user.type;
              }
            }
            else {
              this.showAlert = true;
              this.alertText = response.data.p.errorMsg;
            }
          }, (response) => {
            alert('网络错误')
//            console.log(error);
          })
        }

      },
    }
  }
</script>

<style scoped lang="scss">
  a {
    text-decoraction: none;
    border-bottom: none;
  }

  .mint-header {
    background: black;
  }

  .selece {
    width: 100%;
    background: #ffffff;
    text-align: center;
    div {
      width: 144px;
      height: 144px;
      margin: auto;
      margin-top: 114px;
      border-radius: 50%;
      border: 1px solid #dcdcdc;
      /*margin-left: 39%;*/
      line-height: 144px;
      position: relative;
      img {
        width: 84px;
        height: 84px;
        margin: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
      }
    }
    p:nth-of-type(1) {
      font-size: 24px;
      text-align: center;
      margin-top: 30px;
      color: #3b3b43;
    }
    input {
      width: 80%;
      text-align: center;
      padding-bottom: 26px;
      border: none;
      outline: none;
      border-bottom: 1px solid #dcdcdc !important;
      font-size: 26px;
      margin-top: 46px;
    }
    button {
      width: 470px;
      height: 74px;
      border: none;
      border-radius: 30px;
      font-size: 28px;
      color: #FFFFFF;
      text-align: center;
      margin-top: 51px;
      outline: none;
      background: url("../assets/btn_pay@1x.png");
      background-size: cover;
    }
    p:nth-of-type(2) {
      font-size: 20px;
      color: #a1a1a1;
      margin-top: 36px;
    }
  }
</style>
